<template>
    <div class="box-card box-minheight">
        <div class="card-header">
            <span>串口流量统计字节数[每5秒自动刷新]</span>
        </div>
        <div class="box-content">
            <el-button size="default" type="primary">重置</el-button>
            <el-table style="margin: 10px 0px;" border :data="tableList">
                <el-table-column label="串口号" align="center" prop="no"></el-table-column>
                <el-table-column label="设备" align="center" prop="dev" show-overflow-tooltip></el-table-column>
                <el-table-column label="串口发送" align="center" prop="rxcount" show-overflow-tooltip></el-table-column>
                <el-table-column label="串口接收" align="center" prop="txcount" show-overflow-tooltip></el-table-column>
            </el-table>
            <!-- 分页器 -->
            <!-- <el-pagination v-model:current-page="pageNo" v-model:page-size="pageSize" :page-sizes="[5, 7, 9, 11]"
                :background="true" layout="prev, pager, next, jumper,->,sizes,total" :total="total"
                @current-change="getHasUser" @size-change="handler" /> -->
        </div>
    </div>
</template>

<script setup lang="ts">
import { ref, onMounted } from 'vue'
let tableList = ref<any>([
    {
        no: 'COM1',
        dev: 'uart1',
        rxcount: '5514144',
        txcount: '6204762'
    },
    {
        no: 'COM2',
        dev: 'uart2',
        rxcount: '5514144',
        txcount: '6204762'
    },
    {
        no: 'COM3',
        dev: 'uart3',
        rxcount: '5514144',
        txcount: '6204762'
    },
    {
        no: 'COM4',
        dev: 'uart4',
        rxcount: '5514144',
        txcount: '6204762'
    },
    {
        no: 'COM5',
        dev: 'uart4',
        rxcount: '5514144',
        txcount: '6204762'
    },
    {
        no: 'COM6',
        dev: 'uart4',
        rxcount: '5514144',
        txcount: '6204762'
    },
]);

//组件挂载完毕
onMounted(() => {
    getHasUser();
});
//获取全部已有的用户信息
const getHasUser = async (pager = 1) => {
    //收集当前页码
    // pageNo.value = pager;
    // let result: UserResponseData = await reqUserInfo(pageNo.value, pageSize.value, keyword.value);
    // if (result.code == 200) {
    //     total.value = result.data.total;
    //     userArr.value = result.data.records;
    // }
}

//分页器下拉菜单的自定义事件的回调
const handler = () => {
    getHasUser();
}

</script>

<style scoped lang></style>